<template>
    <view class="shortcut" :style="'right: ' + right + '; bottom: ' + bottom + ';'">
        <!-- 首页 -->
<!--       <view @tap="_onTargetPage" data-index="0">
            <button formType="submit"  :class="'nav-item btn-normal ' + (isShow ? 'show_80' : transparent ? '' : 'hide_80')">
                <text class="iconfont icon-home"></text>
            </button>
        </view> -->

        <!-- 分类页 -->
<!--       <view @tap="_onTargetPage" data-index="1">
            <button formType="submit"  :class="'nav-item btn-normal ' + (isShow ? 'show_60' : transparent ? '' : 'hide_60')">
                <text class="iconfont icon-cate"></text>
            </button>
        </view> -->

        <!-- 购物车 -->
<!--       <view @tap="_onTargetPage" data-index="2">
            <button formType="submit"  :class="'nav-item btn-normal ' + (isShow ? 'show_40' : transparent ? '' : 'hide_40')">
                <text class="iconfont icon-cart"></text>
            </button>
        </view> -->

        <!-- 个人中心 -->
<!--        <view @tap="_onTargetPage" data-index="3">
            <button formType="submit"  :class="'nav-item btn-normal ' + (isShow ? 'show_20' : transparent ? '' : 'hide_20')">
                <text class="iconfont icon-profile"></text>
            </button>
        </view> -->

        <!-- 显示隐藏开关 -->
<!--        <form @submit="_onToggleShow" :report-submit="true">
            <button formType="submit" :class="'nav-item nav-item__switch btn-normal ' + (isShow ? 'shortcut_click_show' : '')">
                <text class="iconfont icon-daohang"></text>
            </button>
        </form> -->
    </view>
</template>

<script>
const app = getApp();
export default {
    data() {
        return {
            // 弹窗显示控制
            isShow: false,
            transparent: true
        };
    },
    options: {
        multipleSlots: true // 在组件定义时的选项中启用多slot支持
    },
    /**
     * 组件的属性列表
     * 用于组件自定义设置
     */
    props: {
        right: {
            type: String,
            default: '24rpx'
        },
        bottom: {
            type: String,
            default: '250rpx'
        }
    },
    /**
     * 组件的方法列表
     * 更新属性和数据的方法与更新页面数据的方法类似
     */
    methods: {
        /**
         * 导航菜单切换事件
         */
        _onToggleShow(e) {
            // 记录formid
            app.globalData.saveFormId(e.detail.formId);
            this.isShow= !this.isShow
            this.transparent: false
        },

        /**
         * 导航页面跳转
         */
        _onTargetPage(e) {
			
            let urls = app.globalData.getTabBarLinks(); // 记录formid
            // app.globalData.saveFormId(e.detail.formId);
			console.log(urls[e.currentTarget.dataset.index],"urlsss")
            uni.navigateTo({
                url: '/' + urls[e.currentTarget.dataset.index]
            });
        }
    }
};
</script>
<style>
/* @import './shortcut.css'; */
</style>
